<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<html>

<head>
	<meta charset="UTF-8">
	<title>我的购物车-azhuo商城</title>
	<link rel="shortcut icon" href="${pageContext.request.contextPath}/image/logo/xyz.ico" type="image/x-icon" />
	<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/style.css" />
	<link rel="stylesheet" href="${pageContext.request.contextPath}/css/reset.css" />
	<link rel="stylesheet" href="${pageContext.request.contextPath}/css/carts.css" />
	<script src="${pageContext.request.contextPath}/js/jquery.min.js"></script>
	<%-- <script src="${pageContext.request.contextPath}/js/carts.js"></script> --%>
	<jsp:include page="/jsps/js/cartsJS.jsp" />
</head>

<body>

	<%-- ----------------------------------- start banner_x ----------------------------------- --%>
	<div class="banner_x center">
		<a href="${pageContext.request.contextPath}/index.jsp" target="_blank">
			<div class="logo fl"></div>
		</a>

		<div class="wdgwc fl ml40">我的购物车</div>
		<div class="wxts fl ml20">温馨提示：产品是否购买成功，以最终下单为准哦，请尽快结算</div>
		<div class="dlzc fr">
			<ul>
				<li><a href="${pageContext.request.contextPath}/jsps/users/myInfo.jsp">个人中心</a></li>
				<li>|</li>
				<li><a href="${pageContext.request.contextPath}/jsps/order/orders.jsp">我的订单</a></li>
				<li>|</li>
				<li><a href="${pageContext.request.contextPath}/jsps/cart/shoppingCar.jsp">购物车</a></li>
				<li>|</li>
				<li><a href="">消息通知</a></li>
			</ul>

		</div>
		<div class="clear"></div>
	</div>
	<%-- ----------------------------------- end banner_x ----------------------------------- --%>

	<%-- 分隔线 --%>
	<div class="xiantiao"></div>

	<%-- ----------------------------------- start 购物车 ----------------------------------- --%>
	<c:choose>
		<%-- 在Session中没有购物车 --%>
		<c:when test="${empty session_cart}">
			<jsp:forward page="/index.jsp" />
		</c:when>

		<%-- 购物车中没有商品  --%>
		<c:when test="${fn:length(session_cart.cartItems) eq 0}">
			<div style="margin: 0 auto; text-align: center;">
				<img style="width:350px;" alt="购物车没有商品"
					src="${pageContext.request.contextPath }/image/goods/empty/empty.jpg" />
				<br />
				<h1>购物车居然是空的，再忙也要剁手！！！</h1>
			</div>
		</c:when>

		<c:otherwise>

			<div class="cartMain">
				<%-- --------------------- start 购物车 表头 --------------------- --%>
				<div class="cartMain_hd">
					<ul class="order_lists cartTop">
						<li class="list_chk">
							<%--所有商品全选--%>
							<input type="checkbox" id="all" class="whole_check" />
							<label for="all"></label> 全选
						</li>
						<li class="list_con">商品信息</li>
						<li class="list_info">商品参数</li>
						<li class="list_price">单价</li>
						<li class="list_amount">数量</li>
						<li class="list_sum">金额</li>
						<li class="list_op">
							<span>操作 >> </span>
							<a href="${pageContext.request.contextPath}/CartServlet?method=cleanCart">清空购物车</a>
						</li>
					</ul>
				</div>
				<%-- --------------------- end 购物车 表头 --------------------- --%>

				<%-- --------------------- start 购物车 商品列表 --------------------- --%>
				<div>
					<div class="cartBox">
						<div class="order_content">

							<%-- ---------- start 购物车 商品列表 店铺的商品列表 --------------------- --%>
							<c:forEach items="${sessionScope.session_cart.cartItems }" var="cartItem">

								<ul class="order_lists">
									<%-- 选择商品(复选框) --%>
									<li class="list_chk">
										<input type="checkbox" id="checkbox_${cartItem.goods.gid}" class="son_check">
										<label for="checkbox_${cartItem.goods.gid}"></label>
									</li>

									<%-- 商品名称 --%>
									<li class="list_con">
										<div class="list_img">
											<a
												href="${pageContext.request.contextPath}/GoodsServlet?method=loadGoods&gid=${cartItem.goods.gid}">
												<img src="${pageContext.request.contextPath}/image/goods/${cartItem.goods.image}" alt="商品图标" />
											</a>
										</div>
										<div class="list_text">
											<a href="${pageContext.request.contextPath}/GoodsServlet?method=loadGoods&gid=${cartItem.goods.gid}">${cartItem.goods.gname}</a>
										</div>
									</li>

									<%-- 商品参数 --%>
									<li class="list_info">
										<p>${cartItem.goods.parameter }</p>
									</li>

									<%-- 商品单价：保留两位小数 --%>
									<li class="list_price">
										<p class="price">￥<fmt:formatNumber type="number" value="${cartItem.goods.price }" pattern="0.00" maxFractionDigits="2" /></p>
									</li>

									<%-- 商品数量 --%>
									<li class="list_amount">
										<div class="amount_box">
											<a href="javascript:;" class="reduce reSty">-</a>
											<input type="text" class="sum" value="${cartItem.count }" />
											<a href="javascript:;" class="plus">+</a>
										</div>
									</li>

									<%-- 商品小计：保留两位小数 --%>
									<li class="list_sum">
										<p class="sum_price">￥<fmt:formatNumber type="number" value="${cartItem.subTotal }" pattern="0.00" maxFractionDigits="2" /></p>
									</li>

									<%-- 删除商品 --%>
									<li class="list_op">
										<p class="del">
											<a href="javascript:;" class="delBtn">移除商品</a>
										</p>
									</li>
								</ul>
							</c:forEach>

						</div>
						<%-- --------------------- end 购物车 商品列表 店铺的商品列表 --------------------- --%>

					</div>
					<%-- --------------------- end 购物车 商品列表 --------------------- --%>

				</div>
				<%-- --------------------- start 购物车 商品列表 --------------------- --%>


				<%-- --------------------- start 结算 --------------------- --%>
				<div class="bar-wrapper">
					<div class="bar-right">
						<div class="piece">
							已选商品<strong class="piece_num">0</strong>件
						</div>
						<div class="totalMoney">
							共计: <strong class="total_text">0.00</strong>
						</div>
						<div class="calBtn">
							<a id="settlement" onclick="settlement()">结算</a>
						</div>
					</div>
				</div>
				<%-- --------------------- end 结算 --------------------- --%>

			</div>

			<%-- 删除商品 --%>
			<div>
				<section class="model_bg"></section>
				<section class="my_model">
					<p class="title">
						删除宝贝<span class="closeModel">X</span>
					</p>
					<p>您确认要删除该宝贝吗？</p>
					<div class="opBtn">
						<a href="javascript:;" class="dialog-sure">确定</a>
						<a href="javascript:;" class="dialog-close">关闭</a>
					</div>
				</section>
			</div>
			<%-- ----------------------------------- end 购物车 ----------------------------------- --%>
		</c:otherwise>
	</c:choose>

	<%-- ----------------------------------- start footer ----------------------------------- --%>
	<jsp:include page="/jsps/includes/footer.jsp" />
	<%-- ----------------------------------- end login ----------------------------------- --%>

</body>

</html>